var map = document.getElementById('map');

drawMap();

function drawMap()
{
    var mapHTML;
    
    mapHTML = '<table height="500px" border="1"><tbody>';
    
    for(var i = 0; i < 9; i++)
    {
        mapHTML += '<tr>';
        
        for(var j = 0; j < 9; j++)
        {
            var id = i+""+j;
            if(id=='11'|id=='37'|id=='38'|id=='69'|id=='85'|id=='42'|id=='23'|id=='5')
            {
                mapHTML += '<td id='+i+''+j+' value = 1 width="55px" onClick="makeMove(this)">&nbsp;</td>';
            }
            else
            {
                mapHTML += '<td id='+i+''+j+' value = 0 width="55px" onClick="makeMove(this)">&nbsp;</td>';
            }
        }        
        mapHTML += "</tr>";
    }
           
    mapHTML += "</tbody></table>"
    map.innerHTML = mapHTML;
    
}

function makeMove(td)
{
    if(td.value==1)
    {
        document.getElementById(td.id).style.background = 'red';
        alert('GOT U~~~~');
    }  
    else
    {
        var x = parseInt(td.id.charAt(0));
        var y = parseInt(td.id.charAt(1));
        var bombNum = 0;
            

        
        var area_width = 3;
        var area_length = 3;
        
        var x_distance = Math.floor(area_length/2);
        var y_distance = Math.floor(area_width/2);

        var area_x1 = x - x_distance;
        var area_y1 = y - y_distance;
        
//        var 
        
//        alert(Math.floor(area_length/2));
        
//        while()
//        {
//            
//        }
            
        
//        for()

        if(x-1>=0 && y-1>=0 &&document.getElementById((x-1)+''+(y-1)).value == 1)
        {
            bombNum++;
        }
        if(x-1>=0 && document.getElementById((x-1)+''+(y)).value == 1)
        {
            bombNum++;
        }
        if(x-1>=0 && y+1<=8 && document.getElementById((x-1)+''+(y+1)).value == 1)
        {
            bombNum++;
        }
        if(y-1>=0 && document.getElementById(x+''+(y-1)).value == 1)
        {
            bombNum++;
        }
        if(y+1<=8 && document.getElementById(x+''+(y+1)).value == 1)
        {
            bombNum++;
        }
        if(x+1<=8 && y-1>=0 && document.getElementById((x+1)+''+(y-1)).value == 1)
        {
            bombNum++;
        }
        if(x+1<=8 && document.getElementById((x+1)+''+(y)).value == 1)
        {
            bombNum++;
        }
        if(x+1<=8 && y+1<=8 && document.getElementById((x+1)+''+(y+1)).value == 1)
        {
            bombNum++;
        }
        
        document.getElementById(td.id).innerHTML = '<td id='+td.id+' value = 0 width="55px" onClick="makeMove(this)">'+bombNum+'</td>';
        document.getElementById(td.id).style.background = 'green';
    }
}
    
            
       
    
